import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:interview/components/app/app_ripple_button.dart';
import 'package:interview/components/status_bar_warpper.dart';
import 'package:interview/controller/navigation_controller.dart';
import 'package:interview/pages/opt/components/opt_list.dart';
import 'package:interview/pages/opt/components/opt_tabbar.dart';
import 'package:interview/theme/app_colors.dart';


class OptPage extends StatefulWidget {
  const OptPage({super.key});
  @override
  State<OptPage> createState() => _OptPageState();
}

class _OptPageState extends State<OptPage> with SingleTickerProviderStateMixin {

  late TabController _tabController;
  int currentIndex = 0; // 当前分类

  List<Map<String , dynamic>> tabbarList = [
    {
      "optType":1,
      "optText":"点赞"
    } , 
    {
      "optType":2,
      "optText":"收藏"
    } 
  ];

  void onTabTapped(int index) {
    setState(() {
      currentIndex = index;
      if (_tabController.index != index) {
        _tabController.animateTo(index);
      }
    });
  }

  @override
  void initState() {
    super.initState();
    _tabController = TabController(length: tabbarList.length, vsync: this);
  }

  @override
  void dispose() {
    _tabController.dispose();
    super.dispose();
  }


  @override
  Widget build(BuildContext context) {
    final navigation = Get.find<NavigationController>();
    final theme = Theme.of(context).extension<AppColors>()!;
      return StatusBarWrapper(
      statusBarColor: theme.subjectPure!,
      statusBarIconBrightness: Theme.of(context).brightness == Brightness.dark? Brightness.light: Brightness.dark,
      child: Scaffold(
        appBar: null,
        body: SafeArea(
          child:Stack(
            children: [
              Container(
                padding: EdgeInsets.symmetric(horizontal: 4),
                color: theme.subjectPure,
                child:Column(
                  mainAxisAlignment: MainAxisAlignment.start,
                  children: [
                    OptTabbar(
                      theme: theme,
                      currentIndex:currentIndex,
                      tabController:_tabController,
                      tabbarList:tabbarList,
                      onTabTapped:onTabTapped
                    ),
                    Expanded(
                      child: TabBarView(
                        controller: _tabController,
                        children: tabbarList.map((tab){
                          return OptList(
                            theme:theme,
                            optType:tab["optType"]
                          );
                        }).toList()
                      )
                    )
                  ],
                ),
              ),
              Positioned(
                top: 14,
                left: 12,
                child: AppRippleButton(
                  padding: EdgeInsets.all(2),
                  splashColor: theme.contrastPure!.withOpacity(0.2),
                  highlightColor: theme.contrastPure!.withOpacity(0.2),
                  onTap: (){
                    navigation.back();
                  },
                  child: Icon(CupertinoIcons.left_chevron , size: 14, color: theme.contrastPure,)
                )
              )
            ],
          )
        ),
      ),
    );
  }
}